<ix-modal-header
  [title]="isNew() ? ('Add API Key' | translate) : ('Edit API Key' | translate)"
  [loading]="isLoading()"
  [requiredRoles]="requiredRoles"
></ix-modal-header>

<mat-card>
  <mat-card-content>
    <form class="ix-form-container" [formGroup]="form" (submit)="onSubmit()">
      <ix-fieldset>
        <ix-input
          formControlName="name"
          [label]="'Name' | translate"
          [required]="true"
        ></ix-input>

        @if (isFullAdmin()) {
          <ix-user-picker
            formControlName="username"
            [label]="'Username' | translate"
            [required]="true"
            [provider]="userPickerProvider"
            [hint]="'Only users with the required privileges are shown.' | translate"
          ></ix-user-picker>
        }

        <ix-checkbox
          formControlName="nonExpiring"
          [label]="'Non-expiring' | translate"
          [tooltip]="tooltips.nonExpiring| translate"
        ></ix-checkbox>

         @if (!form.controls.nonExpiring.value) {
            <ix-datepicker
              formControlName="expires_at"
              [label]="'Expires On' | translate"
              [min]="minDateToday"
            ></ix-datepicker>
          }

        @if (!isNew() && isAllowedToReset()) {
          <ix-checkbox
            formControlName="reset"
            [label]="'Reset' | translate"
            [tooltip]="tooltips.reset | translate"
          ></ix-checkbox>
        }
      </ix-fieldset>

      <ix-form-actions>
        <button
          *ixRequiresRoles="requiredRoles"
          mat-button
          type="submit"
          color="primary"
          ixTest="save"
          [disabled]="form.invalid || isLoading()"
        >{{ 'Save' | translate }}</button>
      </ix-form-actions>
    </form>

  </mat-card-content>
</mat-card>
